<template>
	<view>
		<view class="top">
			<text class="top-text">{{data?data.commission:0}}</text>
			<text class="top-text1">当前可提现金额</text>
		</view>
		<view class="num">
			<view class="num-left">
				<text>提现金额：</text>
				<input v-model="amount" type="digit" placeholder="在此输入金额" placeholder-style="color:#7C7C7C"/>
			</view>
			<view class="num-right" @click="handlequanbu">
				全部提现
			</view>
		</view>
		<!-- <image class="top-image" src="../../static/tx.png" mode=""></image>
		<view class="box-item">
			<text>姓名：</text>
			<input v-model="phone" type="number" placeholder="在此输入姓名" placeholder-style="color:#7C7C7C"/>
		</view>
		<view class="box-item">
			<text>银行卡号：</text>
			<input v-model="phone" type="number" placeholder="在此输入银行卡号" placeholder-style="color:#7C7C7C"/>
		</view>
		<view class="box-item">
			<text>开户行：</text>
			<input v-model="phone" type="number" placeholder="在此输入开户行" placeholder-style="color:#7C7C7C"/>
		</view> -->
		<view class="box-btn">
			<image @click="$u.throttle(handletixian, 1000)" src="http://hmh-app.oss-cn-beijing.aliyuncs.com/webStorage/web_16919962425831541.png" mode=""></image>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				price:'',
				name:'',
				phone:'',
				amount:'',
				data:'',
				share:uni.getStorageSync('share')
			}
		},
		onLoad() {
			//嗨币列表
			this.getUserCommissionInfo()
		},
		methods: {
			//嗨币信息
			async getUserCommissionInfo(){
				const res = await this.$u.api.getUserCommissionInfo()
				this.data = res.data
			},
			//全部提现
			handlequanbu(){
				this.amount = this.data.commission
			},
			//提现
			async handletixian(){
				const params = {
					amount:this.amount
				}
				const res = await this.$u.api.submitWithdraw(params)
				this.$u.toast(res.data)
				this.amount = ''
			}
			
		}
	}
</script>

<style scoped lang="scss">
    .top{
		width: 750rpx;
		height: 240rpx;
		background: url('http://hmh-app.oss-cn-beijing.aliyuncs.com/webStorage/web_1691980195913787.png') no-repeat;
		background-size: 100% 100%;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}
	.top-text{
		font-size: 70rpx;
		font-family: Source Han Sans CN;
		font-weight: 500;
		color: #FEFEFE;
		line-height: 70rpx;
		text-shadow: -1px 0px 4px rgba(122,151,253,0.41);
	}
	.top-text1{
		padding-top: 40rpx;
		font-size: 40rpx;
		font-family: Source Han Sans CN;
		font-weight: 500;
		color: #FEFEFE;
		line-height: 50rpx;
	}
	.num{
		padding: 48rpx 28rpx;
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
	}
	.num-left{
		display: flex;
		flex-direction: row;
		align-items: center;
	}
	.num-left text{
		width: 200rpx;
		font-size: 32rpx;
		font-family: Source Han Sans CN;
		font-weight: 400;
		color: #323232;
		line-height: 38rpx;
	}
	.num-left input{
		font-size: 32rpx;
		font-family: Source Han Sans CN;
		font-weight: 400;
		color: #323232;
		line-height: 38rpx;
	}
	.num-right{
		font-size: 32rpx;
		font-family: Source Han Sans CN;
		font-weight: 400;
		color: #323232;
		line-height: 38rpx;
		padding: 10rpx 0rpx 10rpx 20rpx;
		border-left: 1rpx solid #E3E3E3;
		width: 160rpx;
	}
	.top-image{
		width: 750rpx;
		height: 18rpx;
	}
	.box-item{
		padding: 36rpx 28rpx;
		display: flex;
		flex-direction: row;
		align-items: center;
		border-bottom: 1rpx solid #E3E3E3;
	}
	.box-item text{
		width: 200rpx;
		font-size: 32rpx;
		font-family: Source Han Sans CN;
		font-weight: 400;
		color: #323232;
		line-height: 38rpx;
	}
	.box-item input{
		font-size: 32rpx;
		font-family: Source Han Sans CN;
		font-weight: 400;
		color: #323232;
		line-height: 38rpx;
	}
	.box-btn{
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: center;
		padding-top: 200rpx;
	}
	.box-btn image{
		width: 600rpx;
		height: 60rpx;
	}
</style>
